<html xmlns:wicket>
	<head>
		<title><span wicket:id="base-page-title"></span></title>
	</head>
	<body>
		<style type="text/css">
	
			/* common text */	
			* {
				margin: 0;
			}
			
			body {
				background-color: #FFFFFF;
				color: #666666;
				font-family: arial, sans;
				font-size: 100%;
				line-height: 1.7em;
			}
			
			

			h1 {
				font-size: 2.18em;
				letter-spacing: -0.01em;
				color: #3366FF;
			}			
			
			h2 {
				font-size: 1.45em;
				letter-spacing:	-0.02em;
			}

			/* links */

			a:link {
				color: #669966;
			}

			a:visited {
				color:							#FF3366;
			}

			a:hover {
				text-decoration:		none;
				color:							black;
			}
			
			.user-info a {
				text-decoration:		none;
				border-bottom: dashed 1px white; 
				margin: 5px; 
				font-family: sans-serif;
				font-size: 80%;
			}
		
			.user-info a:link {
				color:							white;
			}

			.user-info a:visited {
				color:							white;
			}
			
			.user-info a:HOVER {
				color:							white;
			}

			/* My styles */
		
			.user-info {
				float: right;
			}
			
			.logo {
				color: white;
				font-size: 2.18em;
				letter-spacing: -0.01em;
				font-weight: bolder;
			}
			
			#base-page-header {
				background-color: #002EB8;
				height: 68px;
				border-bottom: solid black 2px;
				padding-left: 5px;
				padding-top: 5px;
			}
			
			#sidebar {
				float: right;
				width: 16em;
				height: 100%;
				background: #F0F0F0;
				background-image: url("/images/gradient-line.png");
				background-position: left;
				background-repeat: repeat-y;
				
				padding-left: 1em;
				padding-right: 1em;
				padding-top: 1em;
			}
						
			#content {
				padding-left: 2em;
				padding-right: 2em;
				padding-top: 3em;
			}
			
			#content-holder {
				width: 100%;
				height: 100%;
			}
			
			#sidebar-content {
				background: #F0FFFF;
				padding: 5px;
				border: solid #E8E8E8 1px;
				font-weight: bold;
			}
			
			#footer {
				height: 68px;
				width: 100%;
				font-size: 80%;
				color: white;
				text-align: center;
				margin: 0px;
				background: #002EB8;
				padding-top: 24px;
				border-top: solid #333333 2px;
				font-family: monospace;  
			}
			
			#content-holder-table {
				width: 100%;
				height: 100%;
				table-layout: fixed; 
				border-collapse: collapse;
				border: 0px;
				border-top: solid gray 1px;
			}
			
			/* Menus  */
			ul.navigation {
				background-color:		#333333;
				padding:						0em 0.5em;
				list-style-type:		none;
			}
			
			ul.navigation li {
				border-right:				1px solid #666666;
				display:						inline;			
			}
			
			.navigation a {
				color:							#FFFFFF;
				padding:						0.5em;
				font-weight: bold;
			}
			
			.navigation a:hover {
				color:							black;
				background-color:		#FF6633;
			}
		</style>
		
		
		<div id="base-page-header">
			<div id="header-wrapper">
				<span class="user-info">
					<a href="#">Login</a> | <a href="">SignUp</a>
				</span>
			
				<span class="logo">Logo goes here</span>
				
			</div>
		</div>
		
		<div id="main-menu">
			<ul class="navigation">
				<wicket:remove>
					<li><a href="#top">Top</a></li>
					<li><a href="#resources">Related resources</a></li>
					<li><a href="#tagcloud">Read more</a></li>
					<li><a href="#bottom">Embracing this</a></li>
					<li><a href="#nuhuh">Feed</a></li>
				</wicket:remove>
			</ul>
		</div>
		
		
		<table id="content-holder-table">
		
		<tr>
		
		<td>
		<div id="content-holder">
			<div id="sidebar">
				<div id="sidebar-content">
				Resources
				</div>
				<div>
				<a href="#">link1</a><br/>
				<a href="#">link1</a><br/>
				<a href="#">link1</a><br/>
				<a href="#">link1</a><br/>
				</div>
			</div>

			<div id="content">
				<h1>Header</h1>
				
			</div>
		
		</div>	
	
		</td>
		
		</tr>
		
		</table>
					
		<div id="footer">
			copyright | about | etc
			<br/>
			Saint-Petersburg, 2009
		</div>
	
	</body>
</html>